<template>
  <basic-container class="app-Inquiry">
    <div class="top-container">
      <el-form :inline="true" :model="formInline" @keyup.enter.native="onSubmit('formInline')" ref="formInline" class="demo-form-inline" style="display: block !important;">
        <el-form-item label="后台单号" style="margin-bottom: 15px!important;">
          <el-input v-model.trim="formInline.xmbzNo" clearable size="medium" placeholder="后台单号" style="width: 163px;"></el-input>
        </el-form-item>
        <el-form-item label="平台单号" style="margin-bottom: 15px!important;">
          <el-input v-model.trim="formInline.platformOrderId" clearable size="medium" placeholder="平台单号"></el-input>
        </el-form-item>
        <el-form-item label="城市" style="margin-bottom: 15px!important;">
          <el-select ref="deptRef" v-model="formInline.deptIds" multiple clearable placeholder="城市" size="medium" style="width: 100px;" @change="handleCity" @keydown.native="selectBlur($event)">
            <el-option v-for="(house,citykey) in cityselect" :key="citykey" :label="house.deptName" :value="house.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="手机号" style="margin-bottom: 15px!important;">
          <el-input v-model.number="formInline.receiverPhone" clearable size="medium" placeholder="手机号" style="width: 135px"></el-input>
        </el-form-item>
        <el-form-item label="状态" style="margin-right: 0;margin-bottom: 15px!important;">
          <el-select ref="statusRef" v-model="formInline.statuss" multiple clearable size="medium" placeholder="状态" style="width: 130px" @keydown.native="selectBlur($event)">
            <el-option v-for="item in statusList" :key="item.status" :label="item.statusName" :value="item.status" />
          </el-select>
        </el-form-item>
        <el-form-item label="渠道类别" style="margin-bottom: 15px!important;margin-left: 10px;">
          <el-select ref="channelTypeRef" v-model="formInline.channelType" clearable filterable size="medium" placeholder="渠道类别" style="width: 155px" @keydown.native="keydown($event)">
            <el-option v-for="(channelitem,channel) in channelTypellist" :key="channel" :label="channelitem.channelName"
              :value="channelitem.channelKey">
              <span :data-id="channelitem.id" style="display: inline-block;width: 150px;padding: 0 20px;margin-left: -20px;"
                @click="getchannelTypeId($event)">{{ channelitem.channelName }}</span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="渠道" style="margin-bottom: 15px!important;">
          <el-select ref="channelRef" v-model="formInline.channels" clearable multiple filterable size="medium" placeholder="渠道" style="width: 155px" @keydown.native="keydown($event)">
            <el-option v-for="(channelitem,channel) in channerllist" :key="channel" :label="channelitem.channelName"
              :value="channelitem.channelKey"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item sytle="dispaly:flex">
          <el-select ref="selectRef" v-model="formInline.distinguishingFields" placeholder="时间" size="medium" @keydown.native="selectBlur($event)" style="width: 110px;margin: 0 8px;">
            <el-option label="配送时间" value="1"></el-option>
            <el-option label="下单时间" value="2"></el-option>
            <el-option label="退款时间" value="3"></el-option>
          </el-select>
          <el-date-picker
            v-model="timeValue"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            :picker-options="pickerOptions"
            :default-time="['00:00:00', '23:59:59']"
            value-format="yyyy-MM-dd HH:mm"
            format="yyyy-MM-dd HH:mm"
            size="medium"
            align="right">
          </el-date-picker>
        </el-form-item>
        <el-form-item style="margin-bottom: 15px!important;">
          <el-button type="primary" @click="onSubmit('formInline')" size="medium" plain icon="el-icon-search" style="margin-left: 30px;">查询</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="table-container">
      <el-table class="table-width" :data="querylist" header-row-class-name="table-top" :row-class-name="tableRowClassName" @sort-change="changeTableSort"
        style="width: 100%" border>
        <el-table-column fixed prop="xmbzNo" label="后台单号" align="center" min-width="60">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.xmbzNo }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="deptName" label="城市" align="center"></el-table-column>
        <el-table-column label="配送时间" :sortable="'deliveryTimeSort'" align="center" prop="deliveryStartTime" min-width="85">
          <template slot-scope="scope">
            <span v-if="scope.row.deliveryStartTime == ''" style="margin-left: 10px">立即配送</span>
            <span v-if="scope.row.deliveryStartTime !== ''" style="display: flex;flex-direction: column;">
              <span>{{ scope.row.deliveryStartTime.slice(0,10) }}</span>
              <span>{{ scope.row.deliveryStartTime.slice(11,16) }}~{{ scope.row.deliveryEndTime.slice(11,16) }}</span>
            </span>
          </template>
        </el-table-column>
        <el-table-column label="下单时间" :sortable="'orderTimeSort'" align="center" prop="orderTime" min-width="77">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.orderTime.slice(5,16) }}</span>
          </template>
        </el-table-column>
        <el-table-column label="收货人" prop="receiverName" align="center" min-width="50">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.receiverName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="预订人电话" prop="bookerPhone" align="center" min-width="60">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.bookerPhone }}</span>
          </template>
        </el-table-column>
        <el-table-column label="蛋糕款式" prop="orderDetailVOS" align="center" min-width="55">
          <template slot-scope="scope">
            <p v-for="(detail, index) in scope.row.orderDetailVOS" :key="index">
              <span>{{detail.goodsName}}</span>
            </p>
          </template>
        </el-table-column>
        <el-table-column label="配送地址" prop="receiverAddress" align="center" min-width="150px">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.receiverAddress }}</span>
          </template>
        </el-table-column>
        <el-table-column label="渠道" prop="channelName" align="center" min-width="53px">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.channelName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="订单状态" prop="statusName" align="center" min-width="55">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.statusName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="退款时间" :sortable="'refundTimeSort'" prop="refundTime" align="center" min-width="80"></el-table-column>
        <el-table-column label="异常反馈" prop="abnormalContent" align="center" min-width="55">
          <template slot-scope="scope">
            <span style="margin-left: 10px;color: red;">{{ scope.row.abnormalContent }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="customerServiceNotes" align="center" min-width="80">
          <template slot="header" slot-scope="scope">
            <div class="lh-20">客服备注</div>
            <div class="lh-20 c-red">仅客服使用</div>
          </template>
          <template slot-scope="scope">
            <span style="margin-left: 10px;color: red;">{{ scope.row.customerServiceNotes }}</span>
          </template>
        </el-table-column>
        <el-table-column label="操作人" prop="confirmer" align="center" min-width="43">
          <template slot-scope="scope">
            <span style="margin-left: 10px;color: red;">{{ scope.row.confirmer }}</span>
          </template>
        </el-table-column>
        <el-table-column label="配送员" prop="delivery" align="center" min-width="45">
          <template slot-scope="scope">
            <span style="margin-left: 10px;color: red;">{{ scope.row.delivery }}</span>
          </template>
        </el-table-column>
        <el-table-column label="分仓" prop="branchWarehouse" align="center" min-width="35">
          <template slot-scope="scope">
            <span style="margin-left: 10px;color: red;">{{ scope.row.branchWarehouse }}</span>
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="说明" align="center" min-width="105">
          <template slot-scope="scope">
            <el-tag type="danger" size="mini" class="d-b mb-5" v-if="scope.row.replaceCake == 1">蛋糕原料缺失</el-tag>
            <el-tag type="info" size="mini" class="d-b mb-5" v-if="scope.row.refundNotReturnName === '退款不退货'">退款不退货</el-tag>
            <el-tag type="warning" size="mini" class="d-b mb-5" v-if="scope.row.refundMark == '平台退款中'">平台退款中</el-tag>
            <el-tag type="info" size="mini" class="d-b mb-5" v-for="tag in JSON.parse(scope.row.orderTags === '' ? '[]' : scope.row.orderTags)">{{ tag }}</el-tag>

            <el-tag type="warning" size="mini" class="d-b mb-5 tag-c-1abc9c" v-if="scope.row.staffForward">{{ scope.row.staffForward }}</el-tag>
            <el-tag type="warning" size="mini" class="d-b mb-5 tag-c-3498db" v-if="scope.row.tyingRefundNotReturn">{{ scope.row.tyingRefundNotReturn }}</el-tag>
            <el-tag type="warning" size="mini" class="d-b mb-5 tag-c-9b59b6" v-if="scope.row.customChange">客户自助修改了信息</el-tag>
            <el-tag type="warning" size="mini" class="d-b mb-5 tag-c-e67e22" v-if="scope.row.cancelRefundMark">{{ scope.row.cancelRefundMark }}</el-tag>
            <el-tag type="warning" size="mini" class="d-b mb-5 tag-c-c586c0" v-if="scope.row.handleStateName">{{ scope.row.handleStateName }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" align="left" min-width="55">
          <template slot-scope="scope">
            <div class="operate-btns">
              <i v-if="permissionList.refundPending_edit" class="btn-item el-icon-edit" type="text" @click="handleEdit(scope.$index, scope.row)">编辑</i>
              <i v-if="permissionList.refundPending_journal" class="btn-item el-icon-mobile" type="text" @click="handleOrderLog(scope.row)">日志</i>
              <i v-if="permissionList.refundPending_view" class="btn-item el-icon-view" type="text" @click="handleViewLog(scope.$index, scope.row)">查看</i>
              <i v-if="permissionList.refundPending_shortmessage" class="btn-item" @click="handleSMS(scope.$index, scope.row)">短信记录</i>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <pagination v-show="total>0" :total="total" :page.sync="formInline.page" :limit.sync="formInline.size"
        @pagination="getList" />
    </div>

    <orderLogDialog ref="orderLogDialog"></orderLogDialog>
  </basic-container>
</template>

<script>
  import {
    orderRefundMarkList, // 查询
    statusList, // 订单状态
    forceUnlock, // 强制解锁
    startUpdate, //开始修改
    getOrderOperateLog, // 订单日志
    add0rderOperateLog, // 添加订单操作日志
    unlockOrder, //解锁
  } from '@/api/pending'
  import {
    citySelect, // 城市
    getOrderChannelList, // 渠道
    getOrderChannelTypeList, // 渠道类别列表
  } from '@/api/createOrder';
  import Pagination from "@/components/Pagination";
  import {mapGetters} from "vuex"; // 分页
  import orderLogDialog from '@/components/dialog/orderLogDialog'

  export default {
    components: {
      Pagination,
      orderLogDialog
    },
    data() {
      return {
        total: 0,
        deptId:'',
        formInline: {
          deptIds: [0], // 城市id
          xmbzNo: '', // 后台单号
          platformOrderId: '', // 平台单号
          statuss: '',
          channelType: '',// 渠道类别
          channels: '', // 渠道
          StartTime: '',
          EndTime: '',
          receiverPhone: '', // 手机号
          deliveryStartTime: '', // 配送开始时间
          deliveryEndTime: '', // 配送结束时间
          orderTimeStart: '', // 下单开始时间
          orderTimeEnd: '', // 下单结束时间
          orderTimeSort: 0, // 下单时间排序
          deliveryTimeSort: 0, // 配送时间排序
          refundTimeSort: 0, // 退款时间排序
          page: 1,
          limit: 10,
          size: 10,
          distinguishingFields: '1'
        },
        channerllist: '', //渠道
        querylist: [],
        Loading: true,
        statusList: '', // 状态
        pickerOptions:{
          onPick: (obj) => {
            this.pickerMinDate = new Date(obj.minDate).getTime();
          },
          disabledDate:(time)=> {
            if (this.pickerMinDate) {
              const day1 =  31 * 24 * 3600 * 1000
              let maxTime = this.pickerMinDate + day1;
              let minTime = this.pickerMinDate - day1;
              return time.getTime() > maxTime || time.getTime()<minTime
            }
          }
        },
        cityselect: "", // 城市获取列表
        channelTypellist: '', // 渠道类别列表
        getChannelList: { // 渠道列表
          parentId: ''
        },
        startUpdateList: {
          //开始修改列表
          orderId: 1
        },
        timeValue: [
          this.dayjs().format('YYYY-MM-DD') + ' 00:00',
          this.dayjs().format('YYYY-MM-DD') + ' 23:59',
        ], // 查询时间值
        timeValueFlag: false, // 查询时间是否大于31天标记
      }
    },
    created() {
      window.addEventListener("keydown",this.keyupEnter);
      window.unlockOrder = function (orderId) {
        unlockOrder({orderId: orderId})
      }
    },
    watch: {
      'LogFormVisible'() {
        if(this.LogFormVisible) {
          window.removeEventListener("keydown",this.keyupEnter);
        } else {
          window.addEventListener("keydown",this.keyupEnter);
        }
      }
    },
    mounted() {
      citySelect(this.cityLi).then(res => {
        res.data.data.unshift({
                  id: 0,
                  deptName: "全国"
                });
        this.formInline.deptIds=[res.data.data[0].id];
        this.cityselect = res.data.data;

      })
      // 渠道类别列表
      getOrderChannelTypeList().then(res => {
        this.channelTypellist = res.data.data;
      })
      // 状态列表接口
      statusList().then(res => {
        this.statusList = res.data.data
      })
      this.getDeliveryTime()
      this.getList()
      // 城市
    },
    computed: {
      ...mapGetters(["permission"]),
      permissionList() {
        return {
          refundPending_edit: this.vaildData(this.permission.refundPending_edit, false),
          refundPending_journal: this.vaildData(this.permission.refundPending_journal, false),
          refundPending_view: this.vaildData(this.permission.refundPending_view, false),
          refundPending_shortmessage: this.vaildData(this.permission.refundPending_shortmessage, false),
        };
      }
    },
    methods: {
      // 获取今天的时间
      getCurrentTime() {
        let nowYear = new Date().getFullYear()
        let nowMonth = (new Date().getMonth() + 1) < 10 ? "0" + (new Date().getMonth() + 1) : (new Date().getMonth() +
          1);
        let nowDate = new Date().getDate() < 10 ? "0" + new Date().getDate() : new Date().getDate();
        this.formInline.StartTime = nowYear + "-" + nowMonth + "-" + nowDate + ' 00:00:00';
        this.formInline.EndTime = nowYear + "-" + nowMonth + "-" + nowDate + ' 23:59:59';
        this.formInline.deliveryStartTime = this.formInline.StartTime
        this.formInline.deliveryEndTime = this.formInline.EndTime
        this.formInline.orderTimeStart = ''
        this.formInline.orderTimeEnd = ''
        this.getList()
      },
      // 获取城市
      handleCity(data){
      },
      handleOrderLog(item){
        this.$refs.orderLogDialog.show({orderId: item.id})
      },
      onSubmit() {
        this.formInline.page = 1;
        this.getList()
      },
      // 点击编辑，打开详情
      handleEdit(index, row) {
        var authority = JSON.parse(window.localStorage.getItem("saber-userInfo")).content.authority;

        const {
          href
        } = this.$router.resolve({
          path: `/orderdetail`,
          query: {
            id: row.id,
            cityId: row.deptId,
            deptName: row.deptName,
            kind: 'Inquiry-order',
          }
        });
        this.startUpdateList.orderId = row.id
        let orderId = row.id;
        startUpdate(this.startUpdateList).then(res => {
          if (res.data.success == true) {
            let type = 98;
            this.add0rderInquiry(orderId,type); // 解锁日志
            window.open(href, '_blank');
          } else if (res.data.success == false) {
            const hasUnlockPermission = this.permission['refundPending_unlock']
            if (hasUnlockPermission) {
              this.$confirm("是否需要强制解锁此订单?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
              }).then(() => {
                forceUnlock(this.startUpdateList).then(res => {
                  if (res.data.code == 200) {
                    this.add0rderInquiry(orderId,100); // 解锁日志
                    this.$message({
                      type: "success",
                      message: "解锁成功!"
                    });
                    window.open(href, '_blank');
                  }
                });
              }).catch(() => {
                this.$message({
                  type: "info",
                  message: "已取消解锁成功"
                })
              })
            } else {
              this.$message({
                type: 'warning',
                message: '订单已被锁定'
              })

            }
          }
        })
      },
      dealData(authority) {
        const newArr = [];
        authority.forEach(item => {
          newArr.push({
            checked: true,
            value: item
          })
        })
        return newArr;
      },
      // 查询列表
      getList() {
        const errorMsg = this.validateParams()
        if (errorMsg) {
          this.$message.warning(errorMsg);
          return
        }
        this.Loading = true;
        orderRefundMarkList(this.getParams()).then(res => {
          this.total = res.data.data.total
          this.querylist = res.data.data.rows || [{}]
          this.Loading = false;
        })
      },
      validateParams() {
        if (!this.formInline.xmbzNo && !this.formInline.platformOrderId && !this.formInline.receiverPhone) {
          if ((this.formInline.statuss && this.formInline.statuss.length) ||
              this.formInline.channelType ||
              (this.formInline.channels && this.formInline.channels.length)) {
              if (!this.timeValue || !this.timeValue.length) {
                return '请输入搜索时间，且跨度不能超过31天'
              }
          }
          if (this.timeValue && this.timeValue.length && this.isTimeSlotMoreThan(this.timeValue[0], this.timeValue[1])) {
            return '时间间隔不可超过31天'
          }
        }
      },
      getParams() {
        const params = {
          ...this.formInline,
          deliveryStartTime: '',
          deliveryEndTime: '',
          orderTimeStart: '',
          orderTimeEnd: '',
          refundStartTime: '',
          refundEndTime: '',
        }

        if (params.deptIds && params.deptIds.length && !params.deptIds.includes(0)) {
          params.deptIds = params.deptIds.join(',')
        } else {
          delete params.deptIds
        }

        if (params.statuss && params.statuss.length) {
          params.statuss = params.statuss.join(',')
        } else {
          delete params.statuss
        }

        if (params.channels && params.channels.length) {
          params.channels = params.channels.join(',')
        } else {
          delete params.channels
        }

        if (!this.formInline.xmbzNo && !this.formInline.platformOrderId && !this.formInline.receiverPhone &&
          this.timeValue && this.timeValue.length) {
          if (this.formInline.distinguishingFields == 1) {
            params.deliveryStartTime = this.timeValue[0] + ':00';
            params.deliveryEndTime = this.timeValue[1] + ':59';
          } else if (this.formInline.distinguishingFields == 2) {
            params.orderTimeStart = this.timeValue[0] + ':00';
            params.orderTimeEnd = this.timeValue[1] + ':59';
          } else if (this.formInline.distinguishingFields == 3) {
            params.refundStartTime = this.timeValue[0] + ':00';
            params.refundEndTime = this.timeValue[1] + ':59';
          }
        }
        return params
      },
      // 紧急单颜色变化
      tableRowClassName({
        row
      }) {
        if (row.getHour === false || row.level == 2) {
          return 'warning-row';
        }
        if (row.level == 1) {
          return 'red-row'
        }
        return '';
      },
      // 计算时间差
      getHour(endTime) {
        let nowYear = new Date().getFullYear()
        let nowMonth = (new Date().getMonth() + 1) < 10 ? "0" + (new Date().getMonth() + 1) : (new Date().getMonth() +
          1);
        let nowDate = new Date().getDate() < 10 ? "0" + new Date().getDate() : new Date().getDate();
        let nowHours = new Date().getHours() < 10 ? "0" + new Date().getHours() : new Date().getHours();
        let nowMinutes = new Date().getMinutes() < 10 ? "0" + new Date().getMinutes() : new Date().getMinutes();
        let nowTime = nowYear + '-' + nowMonth + '-' + nowDate + ' ' + nowHours + ':' + nowMinutes;
        let s1 = new Date(endTime.replace(/-/g, '/'));
        let s2 = new Date(nowTime.replace(/-/g, '/'));
        let ms = Math.abs(s1.getTime() - s2.getTime());
        let getHour = ms / 1000 / 60 / 60;
        return getHour
      },
      // 选择渠道类型
      getchannelTypeId(e) {
        // 渠道列表接口
        this.getChannelList.parentId = e.currentTarget.dataset.id;
        // 渠道列表接口
        getOrderChannelList(this.getChannelList).then(res => {
          let result = res.data.data;
          this.channerllist = result;
          this.formInline.channels = [];
        })
      },
      // 排序
      changeTableSort(column) {
        const sortFields = ['orderTimeSort', 'deliveryTimeSort', 'refundTimeSort']
        sortFields.forEach(item => {
          this.formInline[item] = 0
        })
        if (column.column) {
          const sortable = column.column.sortable
          const orderTypeMap = {
            'ascending': 1,
            'descending': 2
          }
          this.formInline[sortable] = orderTypeMap[column.order]
        }
        this.getList();
      },
      // 查看订单
      handleViewLog(index,row) {
        let newUrl = this.$router.resolve({
          path: "/viewOrdInfor",
          query: {
            id: row.id,
          }
        });
        let type = 101;
        let orderId = row.id;
        this.add0rderInquiry(orderId,type);
        window.open(newUrl.href, "_blank");
      },
      // 设置默认查询日期
      getDeliveryTime() {
        //前一天设定的日期时间
        let d = new Date
        let year1,month1,day1
        [year1,month1,day1] = [d.getFullYear(),d.getMonth(),d.getDate()];
        let date1 = new Date(year1,month1,day1,0);
        let nowMonth1 = (new Date().getMonth() + 1) < 10 ? "0" + (new Date().getMonth() + 1) : (new Date().getMonth() +
          1);
        let nowDate1 = new Date().getDate() < 10 ? "0" + new Date().getDate() : new Date().getDate();
        let deliveryStartTime = date1.getFullYear() + '-' + nowMonth1 + '-' + nowDate1 + ' ' + '00:00:00';
        this.timeValue.unshift();
        this.formInline.deliveryStartTime = deliveryStartTime;
        //当前设定的日期时间
        let date2 = new Date(year1, month1, day1,23,59,59);
        let deliveryEndTime = date2.getFullYear() + '-' + nowMonth1 + '-' + nowDate1 + ' ' + '23:59:59';
        this.timeValue.push();
        this.formInline.deliveryEndTime = deliveryEndTime;
      },
      // 转换成标准时间（开始）
      changeStartTime(deliveryTime) {
        let date1 = new Date(deliveryTime);
        let nowMonth1 = (date1.getMonth() + 1) < 10 ? "0" + (date1.getMonth() + 1) : (date1.getMonth() +
          1);
        let nowDate1 = date1.getDate() < 10 ? "0" + date1.getDate() : date1.getDate();
        return deliveryTime = date1.getFullYear() + '-' + nowMonth1 + '-' + nowDate1 + ' ' + '00:00:00';
      },
      // 转换成标准时间（结束）
      changeEndTime(deliveryTime) {
        let date1 = new Date(deliveryTime);
        let nowMonth1 = (date1.getMonth() + 1) < 10 ? "0" + (date1.getMonth() + 1) : (date1.getMonth() +
          1);
        let nowDate1 = date1.getDate() < 10 ? "0" + date1.getDate() : date1.getDate();
        return deliveryTime = date1.getFullYear() + '-' + nowMonth1 + '-' + nowDate1 + ' ' + '23:59:59';
      },
      
      // 判断是否大于31天
      isgreaterThan(time1,time2) {
        var data1 = Date.parse(time1.replace(/-/g,"/"));
        var data2 = Date.parse(time2.replace(/-/g,"/"));
        var datadiff = data2-data1;
        var time = 31*24*60*60*1000;
        if(time1.length>0 && time2.length>0){
          if(datadiff<0||datadiff>time){
            this.$message.warning("时间间隔不可超过31天");
            return this.timeValueFlag = true;
          } else {
            return this.timeValueFlag = false;
          }
        }
      },
      isTimeSlotMoreThan(time1,time2) {
        var data1 = Date.parse(time1.replace(/-/g,"/"));
        var data2 = Date.parse(time2.replace(/-/g,"/"));
        var datadiff = data2-data1;
        var time = 31*24*60*60*1000;
        if(time1.length>0 && time2.length>0){
          if(datadiff<0||datadiff>time){
            return true;
          } else {
            return false;
          }
        }
      },
      // 查询短信记录
      handleSMS(index,row) {
        let newUrl = this.$router.resolve({
          path: "/SMSrecord",
          query: {
            id: row.id,
            cityId: row.deptId,
            deptName: row.deptName,
            kind: 'SMS-orders',
            // paperName: this.paperName,
          }
        });
        window.open(newUrl.href, "_blank");
      },
      // 添加订单操作日志
      add0rderInquiry(orderId,type) {
        let queryOrder = {
          orderId,
          type,
          orderType: 1,
          workType: 0
        }
        add0rderOperateLog(queryOrder).then(res => {
          console.log('res',res.data.code)
        })
      },
      // 回车事件
      keyupEnter(){
        if(window.event.keyCode == 13 ){
          this.onSubmit();// 查询事件
        }
      },
      // 静止输入空格
      keydown(event) {
        if(event.keyCode == 32) {
          event.returnValue = false;
        }
        if(event.keyCode == 13) {
          this.$refs['channelTypeRef'].blur();
          this.$refs['channelRef'].blur();
          event.returnValue = false;
        }
      },
      selectBlur(e) {
        if(e.keyCode == 13) {
          this.$refs['deptRef'].blur();
          this.$refs['statusRef'].blur();
          this.$refs['selectRef'].blur();
          e.returnValue = false;
        }
      },
    },
    destroyed() {
      window.removeEventListener("keydown",this.keyupEnter);
    },
    //如果页面有keep-alive缓存功能，这个函数会触发
    activated() {
      window.addEventListener("keydown",this.keyupEnter);
    },
    deactivated() {
      window.removeEventListener("keydown",this.keyupEnter);
    }
  }
</script>

<style lang="scss">
  .red{
    color: #FF0000;
  }
  .app-Inquiry {
    padding-right: 5px;
    .top-container {
      padding: 20px 10px 10px 20px;

      .el-form {
        .el-form-item {
          .line {
            margin: 0 3px;
            color: #8c919c;
          }
        }
      }

      .demo-form-inline {
        display: inline-block;
      }

      .el-form-item {
        margin-bottom: 20px !important;
      }
    }

    .table-container {
      padding-left: 20px;

      .table-top {
        font-size: 13px;
        th {
          padding: 5px 2px;
          .cell {
            padding: 0;
          }
        }
      }

      .el-table {
        .operate-btns {
          .btn-item {
            color: #409eff;
            padding: 4px;
            margin-left: 0;
            display: block;
            font-style: normal;
            line-height: 1;
            font-weight: 600;
            cursor: pointer;
            &:hover {
              color: #66b1ff;
            }
          }
        }
      }

      .el-table__row {
        td {
          padding: 5px 2px;
          font-size: 13px;
          font-weight: 600;
          .cell {
            padding: 0;
            span {
              margin-left: 0;
            }
          }
        }
      }

      .active {
        color: #409eff;
        font-size: 13px;
        font-weight: 600;
      }

      .buttoncolor {
        color: #000;
        font-size: 13px;
        font-weight: 600;
      }

      .warning-row {
        background: oldlace;
        color: #e6a23c;
      }

      .red-row {
        background: #fef0f0;
        color: red;
      }
    }
  }
  .el-date-range-picker .el-picker-panel__footer .el-button--text span {
    display: none;
  }
  .table-width {
    .el-table__fixed {
      .el-table__fixed-body-wrapper {
        .el-table__body {
          .el-table__row {
            td {
              .cell {
                span {
                  margin-left: 0 !important;
                }
              }
            }
          }
        }
      }
    }
  }
</style>
